﻿<%@ Page Title="" Language="C#" MasterPageFile="~/Site.Master" AutoEventWireup="true"
    CodeBehind="Trailers.aspx.cs" Inherits="MBS.Trailers" %>

<asp:Content ID="Content1" ContentPlaceHolderID="HeadContent" runat="server">
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">
    <script type="text/javascript">


        $(document).ready(function () {

            $(".trailer-img").click(function () {
                var src = $(this).attr("src");
                var srcArr = src.split("/");
                var img = srcArr[2];

                document.getElementById("<%=hdnTest.ClientID%>").value = img;
                document.getElementById("<%=Button1.ClientID%>").click();

                $.ajax({
                    type: "POST",
                    url: "Trailers.aspx/showTrailers",
                    data: "{'imageID' : '" + img + "'}",
                    contentType: "application/json;charset=utf-8",
                    dataType: "json",
                    async: true,
                    cache: false,
                    success: function (msg) {

                        document.getElementById("div3").style.display = "inline";
                        $('#video1').attr('src', msg.d);

                    },
                    error: function (x, e) {
                        alert("The call to the server side failed. " + x.responseText);
                    }
                });


            });

        });
       

      
    </script>
    <meta charset="utf-8" />
    <title>Trailers</title>
    <link rel="stylesheet" href="styles.css" />
    <!--[if IE]>
        <script src="http://html5shiv.googlecode.com/svn/trunk
/html5.js"></script>
        <![endif]-->
    <style type="text/css">
        #div1
        {
            height: 336px;
            width: 294px;
        }
        .style1
        {
            width: 312px;
        }
        .style5
        {
            height: 113px;
        }
        .style6
        {
            width: 312px;
            height: 113px;
        }
    </style>
    <div>
        <asp:ScriptManager ID="ScriptManager" runat="server" />
        <table>
            <tr>
                <td class="style5">
                </td>
                <td class="style6">
                    <div id="div2">
                        <marquee behavior="scroll" direction="right" style="height: 251px; width: 930px"> 
                                 
                                            <img  class="trailer-img" id="Img2" src="../Images/Ad2.jpg" style="height: 251px; width: 214px" alt=""/>
                                            <img  class="trailer-img" id="Img3" src="../Images/im1.jpg" style="height: 251px; width: 214px" alt=""/>
                                            <img  class="trailer-img" id="Img4" src="../Images/im11.jpg" style="height: 251px; width: 214px" alt=""/>
                                            <img  class="trailer-img" id="Img5" src="../Images/im3.jpg" style="height: 251px; width: 214px" alt=""/>
                                            <img  class="trailer-img" id="Img6" src="../Images/im6.jpg" style="height: 251px; width: 214px" alt=""/>
                                            <img  class="trailer-img" id="Img7" src="../Images/im8.jpg" style="height: 251px; width: 214px" alt=""/>
                                 
                                            <img  class="trailer-img" id="Img9" src="../Images/jnm.jpg" style="height: 251px; width: 214px" alt=""/>
                                            <img  class="trailer-img" id="Img10" src="../Images/LPNY.jpg" style="height: 251px; width: 214px" alt=""/>
                                            <img  class="trailer-img" id="Img11" src="../Images/RS.jpg" style="height: 251px; width: 214px" alt=""/>
                                            <img  class="trailer-img" id="Img12" src="../Images/Wanted.jpg" style="height: 251px; width: 214px" alt=""/>
                                                                                  
                         </marquee>
                    </div>
                </td>
            </tr>
            <tr>
                <td>
            </tr>
        </table>
    </div>
    <table>
        <tr>
            <td>
                <asp:UpdatePanel ID="UpdatePanel2" UpdateMode="Conditional" runat="server">
                    <ContentTemplate>
                        <fieldset>
                            <legend>Movie Details</legend>
                            <asp:Button ID="Button1" runat="server" OnClick="Button1_Click1" Style="display: none"
                                Text="ViewDetails" />
                            <br />
                            <asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="false">
                                <Columns>
                                    <asp:TemplateField HeaderText="MovieTitle">
                                        <ItemTemplate>
                                            <asp:Label ID="lblCol1" runat="server" Text='<%#Eval("MovieTitle")%>'></asp:Label>
                                        </ItemTemplate>
                                    </asp:TemplateField>
                                    <asp:TemplateField HeaderText="Description">
                                        <ItemTemplate>
                                            <asp:Label ID="lblCol1" runat="server" Text='<%#Eval("Description")%>'></asp:Label>
                                        </ItemTemplate>
                                    </asp:TemplateField>
                                    <asp:TemplateField HeaderText="Duration">
                                        <ItemTemplate>
                                            <asp:Label ID="lblCol1" runat="server" Text='<%#Eval("Duration")%>'></asp:Label>
                                        </ItemTemplate>
                                    </asp:TemplateField>
                                    <asp:TemplateField HeaderText="Genre">
                                        <ItemTemplate>
                                            <asp:Label ID="lblCol1" runat="server" Text='<%#Eval("Genre")%>'></asp:Label>
                                        </ItemTemplate>
                                    </asp:TemplateField>
                                    <asp:TemplateField HeaderText="Cast">
                                        <ItemTemplate>
                                            <asp:Label ID="lblCol1" runat="server" Text='<%#Eval("Cast")%>'></asp:Label>
                                        </ItemTemplate>
                                    </asp:TemplateField>
                                    <asp:TemplateField HeaderText="Rating">
                                        <ItemTemplate>
                                            <asp:Label ID="lblCol1" runat="server" Text='<%#Eval("Rating")%>'></asp:Label>
                                        </ItemTemplate>
                                    </asp:TemplateField>
                                </Columns>
                            </asp:GridView>
                            <br />
                        </fieldset>
                    </ContentTemplate>
                </asp:UpdatePanel>
            </td>
            <td>
                <div id="div3" style="display: none">
                    <p>
                        <iframe id="video1" width="400" height="300" src="" frameborder="0" allowfullscreen>
                        </iframe>
                        <div class="no-html5-video">
                            <p>
                                This video will work in Mozilla Firefox or Google Chrome only.</p>
                        </div>
                    </p>
                    </section>
                </div>
            </td>
        </tr>
    </table>
    <asp:HiddenField ID="hdnTest" runat="server" />
    <asp:HiddenField ID="hdnTrailers" runat="server" />
</asp:Content>
